<template>
  <FModal width="600" @ok="ok"
          header="取值" body-height="300" ref="refFModal">
    <el-text truncated>
      当前数据域: {{ field.formFieldVariableShowName }}
    </el-text>

    <div>
      <InputDelegate ref="refInputDelegate" auth="edit" :component="field.component" :field="field"/>
    </div>
  </FModal>
</template>
<script setup>

import FModal from '@/components/FModal/index.vue';
import {shallowRef} from 'vue';
import InputDelegate from '@/components/form/FormInputDelegates/InputDelegate.vue';
import {ElMessage} from 'element-plus';
import {isEmpty, real} from '@/utils/CommonUtils';

const refInputDelegate = shallowRef();
const refFModal = shallowRef();
const field = shallowRef();
const emit = defineEmits(['addVariable']);
import {resolveFieldType} from '@/components/form/InputComponents';
import {resolveFieldTypeByComponentName} from '@/components/form/DesignComponents';

function setData(_field) {
  field.value = _field;
  open();
}

function open() {
  refFModal.value.open();
}

function ok() {
  let value = refInputDelegate.value.getFieldValue({});
  if (isEmpty(value)) {
    ElMessage({
      message: '请修改取值',
      type: 'warning',
    });
    return;
  }
  let title = refInputDelegate.value.getFieldValueText({});
  let inputType = real(field).inputType;
  // inputType = resolveFieldType(real(field));
  inputType = resolveFieldTypeByComponentName(real(field).component);
  let res = `[${value}:${inputType}:${title}]`;
  emit('addVariable', res);
  close();
}

function close() {
  refFModal.value.close();
}

defineExpose({
  setData
});
</script>
<script>
export default {
  name: 'FormFieldValueCreateModal'
};
</script>
<style>

</style>
